
#{extends 'main.html' /} #{set title:'Home' /}
<!-- @author Ayatullah Marawan
this page retrieve all members with check box next to each member for Registered User in order
to choose members he wants to add to either his private List or public list for privacy settings -->
	
<body style="background-color: white;">

<script>
	// ------------------ This is all Javascript. w3schools.com/js/default.asp for education ------------
	// The main purpose of javascript is to dynamically manipulate html DOM elements upon user action or specific events
	// You can also send HTTP Post or Get requests (Google them!!!) without the need of forms jus like I did in 'submitDelete()' ;)
	var selected = new Array();
	function del(id,elem) {
		if (elem.checked)
			selected.push(id);
		else
			undoDelete(id);		
	}
	function undoDelete(id) {
		selected.splice(selected.indexOf(id),1);
	}
	/**
	 * Creates an Post HTTP request to the Users.delete() function
	 * Users.delete() expects parameter names 'ids'
	 */
	function submitDelete() {	
		// This is jQuery syntax. jQuery is a javascript library that makes life easier. (docs.jQuery.com)
		// If u notice in the first line of this file, we extend main.html. Take a look on it @ views/main.html.. U'll notice
		// That the jQuery library is included (<script src="bla.js">) among other things =)	
		$.post('@{Application.addToPrivateList}', //The AtSign{Controller.methodName} gets the URL to that method name ;)
			{ids: selected}, function(data){
				//window.location.reload();
				var doc = document.open("text/html", "replace");
				doc.write(data); //yet another predefined javascript function. You can mix and match between jQuery and Javascript all u want. jQuery is just another javascript library at the end of the day =)
				doc.close();
			});
	}
	
	
	// ------------------------ End of Javascript code -------------------------------
</script>
<script>
// ------------------ This is all Javascript. w3schools.com/js/default.asp for education ------------
// The main purpose of javascript is to dynamically manipulate html DOM elements upon user action or specific events
// You can also send HTTP Post or Get requests (Google them!!!) without the need of forms jus like I did in 'submitDelete()' ;)
var selected = new Array();
function del(id,elem) {
	if (elem.checked)
		selected.push(id);
	else
		undoDelete(id);		
}
function undoDelete(id) {
	selected.splice(selected.indexOf(id),1);
}
function submitTwoDelete() {	
		// This is jQuery syntax. jQuery is a javascript library that makes life easier. (docs.jQuery.com)
		// If u notice in the first line of this file, we extend main.html. Take a look on it @ views/main.html.. U'll notice
		// That the jQuery library is included (<script src="bla.js">) among other things =)	
		$.post('@{Application.addToPublicList}', //The AtSign{Controller.methodName} gets the URL to that method name ;)
			{ids: selected}, function(data){
				//window.location.reload();
				var doc = document.open("text/html", "replace");
				doc.write(data); //yet another predefined javascript function. You can mix and match between jQuery and Javascript all u want. jQuery is just another javascript library at the end of the day =)
				doc.close();
			});
	}

</script>
<script type="text/javascript">
function show_alert()
{
alert("you have added Members successfully !");
}
</script>
   
        <h1>
                <font size="3" face="New times roman" color="red"> <i> Here
                                all members to add : </i>
                </font>
        </h1>

        #{ifnot allUsers}
        <p>There are no members !!</p>
        #{/ifnot} 
        
        #{list items:allUsers, as:'RegisteredUser'}
        <li>
                <div id="${RegisteredUser.id}">
                        
<input id="usr_${RegisteredUser.id}" type="checkbox" onclick="del(${RegisteredUser.id},this)">${RegisteredUser.name}</input>
			<!-- The DollarSign{whatever} is used to access whetever was rendered to this view through the render method in the corresponding controller class -->
			&nbsp;
                                <h4>${RegisteredUser.mail}</h4>
                                               
                </div>
       #{if models.RegisteredUser.findById(Long.parseLong(session.get("RegisteredUserId"))).privateList.contains(models.RegisteredUser.findById(RegisteredUser.id))}
			<p>already a Member in Private List</p>
			#{/if}  
			
			       #{if models.RegisteredUser.findById(Long.parseLong(session.get("RegisteredUserId"))).publicList.contains(models.RegisteredUser.findById(RegisteredUser.id))}
			<p>already a Member in public List</p>
			#{/if}        
                
        </form>
        #{/list}
         <button onclick="submitDelete()" onclick="show_alert()" value="Show alert box"">Add Selected Users to Private List!</button>
         <button onclick="submitTwoDelete()">Add Selected Users to public List!</button>
		<!-- Heidi ElToukhy
This is a button that enables the user to add the checked users in his publicList
@author Heidi ElToukhy --> <a href="@{registeredusers.setprivacy()}">Back to Privacy Settings</a>
        <a href="@{Application.viewprofile()}">Back to Profile Page</a>
